<template>
  <div class="form-box">
    <el-form ref="elForm" width="600px" :model="info" size="medium" label-width="100px" style="max-width: 1200px">
      <el-form-item label="时间" prop="isTime">
        <el-switch v-model="form.isTime" active-color="#14CC0A" active-value="open" inactive-value="close"></el-switch>
      </el-form-item>
      <el-form-item label="位置" prop="isLocal">
        <el-switch v-model="form.isLocal" active-color="#14CC0A" active-value="open" inactive-value="close"></el-switch>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" size="medium" style="width: 120px" @click="submitForm" :loading="isLoading">保存
        </el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { getNetworPeripheralsFillApi, editNetworPeripheralsFillApi } from "@/api/network";

export default {
  props: {
    info: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {
      activeName: 'first',
      isLoading: false,
      form: {
        isTime: 'open',
        isLocal: 'open',
      },
    };
  },
  created() {
    // this.getInfo();
  },
  methods: {
    submitForm() {
      return false;
      this.isLoading = false;
      editNetworPeripheralsFillApi(this.form).then(res => {
        this.form = res;
        this.isLoading = false;
        this.$message({
          type: 'success',
          message: '成功!'
        });
      })
    },
    getInfo() {
      getNetworPeripheralsFillApi().then(res => {
        this.form = { ...this.form, ...res };
      })
    }
  },
};
</script>

<style lang="scss" scoped>
.form-box {
  width: 600px;
  .el-form-item {
    margin-bottom: 10px;
  }
  .el-divider--horizontal {
    margin: 10px 0;
  }
}
</style>